<template>
  <layout class="layout-100">
    <Header class="header-cont">方案制定</Header>
    <Content class="content-cont">
      <Button type="primary" style="margin-right: 15px;margin-bottom: 20px" @click="addMeasures">新增</Button>
      <Table border :columns="columns" :data="measuresList" class="scroll-bar">
        <template slot-scope="{ row, index }" slot="action" >
          <span title="编辑" class="button-class" @click="editMeasures(row,index)" type="text">编辑</span>
          <span title="不涉及" class="button-class" @click="delMeasures(index)" type="text">不涉及</span>
        </template>
      </Table>
    </Content>
    <Footer class="footer-cont">
      <Button type="primary" @click="saveSubmit()">保存</Button>
      <Button @click="closetab">取消</Button>
    </Footer>
    <Modal v-model="isInquiries" title="业务问询" width="50%" ok-text="提交" :footer-hide="true">
      <div class="modal-content">
        <inquiries ref="isInquiriesBox" :checkedRows="checkedRows" :businessType="businessType" @modelBox="modelBox" @person="person"></inquiries>
      </div>
    </Modal>
    <Modal v-model="personModel" title="选择人" width="80%" ok-text="提交" :footer-hide="true">
      <div class="modal-content">
        <checkPerson @personBox="personBox"></checkPerson>
      </div>
    </Modal>
    <span class="inquiries" @click="replyChild()">问询</span>
  </layout>
</template>
<script>
import inquiries from '../../components/modules/inquiries/index'
import checkPerson from '../../components/modules/inquiries/checkPerson'
  import addMeasuresModal from './addMeasuresModal.vue'
  import { mapMutations } from 'vuex'
  export default {
    components: { addMeasuresModal,inquiries,
      checkPerson },
    name: "make-measure",
    data() {
      return {
        businessType:'businesstype_measures',
        isInquiries:false,
        personModel:false,
        checkedRows:[],
        id:this.$route.params.id,
        measuresList:[],//方案列表
        model:true,
        editMsg:{},
        editIndex:'',
        columns:[
          {
            title: '序号',
            type: 'index', //序号
            align: 'center',
            width: '50'
          },
          {
            title: '管控措施',
            key: 'measures',
            tooltip:true,
            align: 'center',
          },
          {
            title: '措施类型',
            key: 'measureType',
            align: 'center',
            render: (h, params) => {
              if(params.row.measureType == 1){
                return h('span','管理')
              }else if (params.row.measureType == 2){
                return h('span','技术')
              }
            }
          },
          {
            title: '频次',
            key: 'frequencyName',
            align: 'center'
          },
          {
            title: '项目部管理部门',
            key: 'projectManagementDepartment',
            align: 'center',
            tooltip:true,
          },
          {
            title: '项目部分管领导',
            align: 'center',
            tooltip:true,
            key: 'projectManagementLeader'
          },
          {
            title: '项目部主管领导',
            align: 'center',
            tooltip:true,
            key: 'leaderInChargeOfProjectDepartment'
          },
          {
            title: '工程公司管理部门',
            align: 'center',
            tooltip:true,
            key: 'controlDepartmentOfEngineeringCompany',
            checkAccess:[4],
          },
          {
            title: '工程公司分管领导',
            align: 'center',
            tooltip:true,
            key: 'leaderInChargeOfEngineeringCompany',
            checkAccess:[4],
          },
          {
            title: '集团公司管理部门',
            align: 'center',
            tooltip:true,
            key: 'groupCompanyControlDepartment',
            checkAccess:[3,4],
          },
          {
            title: '集团公司分管领导',
            align: 'center',
            tooltip:true,
            key: 'leaderInChargeOfGroupCompany',
            checkAccess:[3,4],
          },
          {
            title: '操作',
            width:150,
            align: 'center',
            slot: 'action',
          }
        ]
      }
    },
    methods: {
      //获取风险详情
      getRiskDetail(){
        this.$api.measurePlan.getRiskDetail(this.id).then((res) => {
          if (res.code == 200) {
            if(this.checkedRows.length > 0){
              this.checkedRows = []
            }
            this.checkedRows.push(res.data)
          } else {
            this.$Message.error(res.data.msg);
          }
        })
      },
      // 打开问询弹框
      replyChild(){
        if(this.checkedRows.length == 0){
          this.checkedRows.push(this.editModel)
        }
        this.isInquiries = true
        this.$refs.isInquiriesBox.isModel()
      },
      // 关闭问询框
      modelBox(){
        this.isInquiries = false
      },
      // 打开人员选择框
      person(){
        this.personModel = true
      },
      // 关闭人员选择框
      personBox(){
        this.personModel = false
      },
      ...mapMutations(['closeTag']),
      closetab() {
        /**
         * 如果是调用closeTag方法，普通的页面传入的对象参数只需要写name字段即可
         * 如果是动态路由和带参路由，需要传入query或params字段，用来区别关闭的是参数为多少的页面
         */
        this.closeTag({
          name: this.$route.name,
          params: this.$route.params
        })
      },

      getMeasurePlan(){
        this.$api.measurePlan.matchingMeasuresList(this.id).then(res => {
          if (res.code == 200) {
            this.measuresList = res.data
          } else {
            this.$Message.error('保存失败')
          }
        })
      },
      addMeasures(){
          this.$router.push({
              name: 'add-measures',
              params: {
                  level:this.$route.params.level,
                  id:this.$route.params.id,
                  name:'措施添加',
              }
          })
      },
      editMeasures(msg,index){
          localStorage.setItem('measuresData',JSON.stringify(msg))
          localStorage.setItem('editIndex',JSON.stringify(index))
          this.$router.push({
              name: 'edit-measures',
              params: {
                  level:this.$route.params.level,
                  id:this.$route.params.id,
                  name:'措施方案编辑',
              }
          })
      },
      delMeasures(row){
        this.measuresList.splice(row, 1)
      },
      saveSubmit(){
        if(this.measuresList.length == 0){
          this.$Message.warning('请新增方案');
          return;
        }
        this.$api.measurePlan.submitMeasure(this.measuresList).then(res => {
          if (res.code == 200) {
            this.closetab();
            this.$Message.success('保存成功')
          } else {
            this.$Message.error('保存失败')
          }
        })
      },
      //表格权限展示
      handleColumns (columns) {

        // 遍历处理列数组list，判断查询是否是权限选择列，如果是权限列，判断角色是否有权限，有则显示，无则隐藏
        columns.map((item, index) => {
          let checkAccess = item.checkAccess
          let access = this.$route.params.level
          if(checkAccess){

            // 判断角色是否有权限，checkAccess是列传过来的值，access是用户登录时后台返回值
            if (this.isInArray(checkAccess,access)) {
              this.columns.splice(index, 1)
              this.handleColumns(this.columns)
            }
          }

        })

      },
      isInArray(arr,value){
        for(var i = 0; i < arr.length; i++){
          if(value == arr[i]){
            return true;
          }else{
          }
        }
        return false;
      },

    },
    mounted () {
        if(this.measuresList.length == 0){
            this.getMeasurePlan();
        }

        this.handleColumns(this.columns);
        this.getRiskDetail()
    },
    activated() {
      if(JSON.parse(localStorage.getItem('measuresData'))){
          let index = JSON.parse(localStorage.getItem('editIndex'));
          let data =  JSON.parse(localStorage.getItem('measuresData'));
          if(index != null){
              this.$set(this.measuresList, index, data)
          }else{
              this.measuresList.push(data);
          }
          localStorage.removeItem('measuresData')
          localStorage.removeItem('editIndex')
      }
    }
  }
</script>

<style scoped>

</style>